<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtmBox">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="../css/reset-min.css">
<link rel="stylesheet" type="text/css" href="../css/style.css">
<title></title>
</head>

<body>


	<div class="xsWrap">
		<!-- 顶导 -->
		<div class="topNav clearfix">
			<div class="navBox">
				<div class="navSquare"><a class="navMode" href="#"><span class="navLTxt">广场</span><em class="xsIcon navMore"></em></a>
					<div class="squareLayer">
						<ul class="layerColor">
							<li class="layerL"><a href="#" class="colorIcon photoBox"><span class="xsIcon icon_photoS"></span></a><a class="colorTxt" href="#" >摄影</a></li>
							<li class="layerL"><a href="#" class="colorIcon beautyBox"><span class="xsIcon icon_beautyS"></span></a><a class="colorTxt" href="#" >美妆服饰</a></li>
							<li class="layerL"><a href="#" class="colorIcon beautyBox"><span class="xsIcon icon_foodS"></span></a><a class="colorTxt" href="#" >美食</a></li>
							<li class="layerL"><a href="#" class="colorIcon sportBox"><span class="xsIcon icon_sportS"></span></a><a class="colorTxt" href="#" >运动</a></li>
							<li class="layerL"><a href="#" class="colorIcon techBox"><span class="xsIcon icon_techS"></span></a><a class="colorTxt" href="#" >科技生活</a></li>
							<li class="layerL"><a href="#" class="colorIcon gameBox"><span class="xsIcon icon_gameS"></span></a><a class="colorTxt" href="#" >游戏</a></li>
							<li class="layerL"><a href="#" class="colorIcon homeBox"><span class="xsIcon icon_homeS"></span></a><a class="colorTxt" href="#" >家居设计</a></li>
							<li class="layerL"><a href="#" class="colorIcon petBox"><span class="xsIcon icon_petS"></span></a><a class="colorTxt" href="#" >宠物</a></li>
							<li class="layerL"><a href="#" class="colorIcon musicBox"><span class="xsIcon icon_musicS"></span></a><a class="colorTxt" href="#" >音乐</a></li>
							<li class="layerL"><a href="#" class="colorIcon carBox"><span class="xsIcon icon_carS"></span></a><a class="colorTxt" href="#" >汽车</a></li>

						</ul>					

					</div>

				</div>
				<div class="navSearch">
					<div class="navSearBox"><input type="text" placeholder="请输入关键字" class="navSearInput"><span class="xsIcon icon_search"></span></div>
				</div>
			</div>

			<div class="navR">
				<!-- 已登录 -->
				<ul class="navRList clearfix">
					<li class="navli userAdd"><a class="navMode" href=""><span class="xsIcon icon_add"></span></a>
						<!-- 发布弹层 点击【+】出现 -->
						<div class="pubLayer">
							<p class="pubLi"><a href="#" class="logLiTxt">发布文章</a></p>
							<!-- 点击【发布专辑】出现 创建专辑弹层 -->	
							<p class="pubLi"><a href="#" class="logLiTxt">创建专辑</a></p>	
						</div>
						<!-- /发布弹层 -->
					</li>
					<li class="navli usermsg"><a class="navMode" href=""><span class="xsIcon icon_msg"></span><em class="msgNum">99+</em></a></li>
					<li class="navli userNotice"><a class="navMode" href=""><span class="xsIcon icon_notice"></span></a>
						<div class="noticeLayer">
							<p class="noticeTit">我的消息</p>
							<!-- 通知弹层 点击【我的消息】出现 -->
							<div class="noticeListBox">
								<ul class="noticeList">
									<li class="clearfix">
										<a class="noticeImg"><img src="../images/userS.jpg" alt></a>
										<div class="noticeMain">
											<p class="noticeName"><a class="nameTxt">用户昵称八个字啊</a></p>
											<p class="noticeCon">转采了你的专辑<a class="noAlName">小小花蛤</a>到<a class="noAlNameT">小小花蛤</a></p>
										</div>
									</li>
									<li class="clearfix">
										<a class="noticeImg"><img src="../images/userS.jpg" alt></a>
										<div class="noticeMain">
											<p class="noticeName"><a class="nameTxt">用户昵称八个字啊</a></p>
											<p class="noticeCon">转采了你的专辑<a class="noAlName">小小花蛤</a>到<a class="noAlNameT">小小花蛤</a></p>
										</div>
									</li>
									<li class="clearfix">
										<a class="noticeImg"><img src="../images/userS.jpg" alt></a>
										<div class="noticeMain">
											<p class="noticeName"><a class="nameTxt">用户昵称八个字啊</a></p>
											<p class="noticeCon">转采了你的专辑<a class="noAlName">小小花蛤</a>到<a class="noAlNameT">小小花蛤</a></p>
										</div>
									</li>
									<li class="clearfix">
										<a class="noticeImg"><img src="../images/userS.jpg" alt></a>
										<div class="noticeMain">
											<p class="noticeName"><a class="nameTxt">用户昵称八个字啊</a></p>
											<p class="noticeCon">转采了你的专辑<a class="noAlName">小小花蛤</a>到<a class="noAlNameT">小小花蛤</a></p>
										</div>
									</li>									
								</ul>
								<p class="noticeMore"><a class="noticeMoreTxt">查看所有消息>></a></p>
							</div>
							<!-- /通知弹层 -->
						</div>

					</li>
					<li class="navli userLog"><a class="navMode" href=""><img src="../images/userS.jpg" alt="" class="headImg"><em class="xsIcon navMore"></em></a>
						<!-- 用户弹层 -->
						<div class="logLayer">
							<p class="logLi"><a href="#" class="logLiTxt">消息箱</a></p>	
							<p class="logLi"><a href="#" class="logLiTxt">用户设置</a></p>	
							<p class="logLi"><a href="#" class="logLiTxt">退出登录</a></p>	
						</div>
						<!-- /用户弹层 -->
					</li>
				</ul>
				<!-- /已登录 -->

				<!-- 未登录 
				<div class="unLogList"><a class="btnB" href="#">登录</a><a class="btnB" href="#">注册</a></div>
				 /未登录 -->

			</div>

			<div class="navLogo"><a class="logoBox"><img src="../images/logoM.png" alt=""></a></div>
		</div>
		<!-- /顶导 -->
		<!-- main -->
		<div class="mainBox clearfix">
			<div class="xsNLayout">
				<!-- 编辑专辑 -->			
				
				<div class="editUserBox">
					<div class="xsTit">个人资料</div>
					<div class="editForm">
						<div class="formCata">
							<dl class="clearfix">
								<dt class="formName">登录名</dt>
								<dd class="formInput"><input class="xsInput fw01" type="text" value="zhuanji名称"></dd>
								<dd class="formTip" style="display:none;"><span class="xsIcon icon_wrong"></span>请选择分类</dd>
							</dl>
							<dl class="clearfix">
								<dt class="formName">昵称</dt>
								<dd class="formInput"><input class="xsInput fw01" type="text" value="昵称"></dd>
								<dd class="formTip" style="display:none;"><span class="xsIcon icon_wrong"></span>不能为空</dd>
							</dl>

							<dl class="clearfix">
								<dt class="formName">头像</dt>
								<dd class="formInput"><div class="userImgShow"><img src="../images/userL.jpg" alt=""></div><div class="picInput">
											<p class="picInfo">支持jpg、jpeg、png、gif格式；<br>
											建议尺寸：120pxX120px 文件不超过100K</p>						
											<p class="fileinput">
												<input type="file" id="login01" class="formFile"></p>
										</div></dd>
								
							</dl>
							<dl class="clearfix">
								<dt class="formName">性别</dt>
								<dd class="formInput">
									<label class="sexF"><input type="radio">男</label>
									<label class="sexF"><input type="radio">女</label>
									<label class="sexF"><input type="radio">保密</label>
								</dd>
								
							</dl>		
							<dl class="clearfix userbirth">
								<dt class="formName">生日</dt>
								<dd class="formInput">
									<input class="xsInput fw07" type="text" placeholder="年"><input class="xsInput fw07" type="text"  placeholder="月"><input class="xsInput fw07" type="text"  placeholder="日">
								</dd>
								
							</dl>
							<dl class="clearfix">
								<dt class="formName">职业</dt>
								<dd class="formInput"><input class="xsInput fw01" type="text"></dd>

							</dl>																				
						</div>
						<div class="formCata">
							<dl class="clearfix">
								<dt class="formName">个人主页</dt>
								<dd class="formInput"><input class="xsInput fw01" type="text"></dd>

							</dl>							
							<dl class="clearfix">
								<dt class="formName">关于自己</dt>
								<dd class="formInput"><textarea class="xsArea fwA01"></textarea></dd>
								
							</dl>
							<dl class="clearfix">
								<dt class="formName">个性网址</dt>
								<dd class="formInput"><span class="userURL">huaban.com/<input type="text" class="xsInput fw07" value="21212"></span></dd>
								
							</dl>							
						</div>

					</div>
					<p class="saveBtn"><a class="btnD">保存设置</a></p>
				</div>
				<!-- /编辑专辑 -->
			</div>
		</div>

		<!-- /main -->

	</div>




</body>
</html>
